<template lang="">
  <div class="sale-warp">
    <div class="page">
      <mine-header>{{title}}</mine-header>
      <div class="center" @click="centerAction">
        <span>兑换中心</span>
        <span>></span>
      </div>
      <com :title="title"></com>
    </div>
    <router-view></router-view>
  </div>
</template>
<script>
import MineHeader from "@/views/Mine/com/mine-header.vue"
import Salecom from"@/views/Mine/com/mysale/com.vue"
export default {
  name: "mysale",
  components: {
    [MineHeader.name]:MineHeader,
    [Salecom.name]:Salecom
  },
  data() {
    return {
      title:"我的优惠券"
    }
  },
  methods: {
    centerAction() {
      this.$router.push({
        name:"convert"
      })
    }
  }
}
</script>
<style lang="scss" scoped>
.sale-warp{
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  z-index: 20;
}
.page{
  background-color: #f4f6f9;
}
  .center{
    width: 100%;
    height: 50px;
    background-color: #fff;
    margin: 15px 0px;
    border-top: 1px solid #dedddd;
    border-bottom: 1px solid #dedddd ;
    display: flex;
    justify-content: space-between;
    align-items: center;
    span:nth-child(1){
      font-size: 14px;
      padding:0 20px ;
      color: #32354A;
    }
    span:nth-child(2){
      font-size: 24px;
      padding-right: 20px;
      color: #32354A;
    }
  }
</style>